<template>
	<view>
		<view style="margin-top: 50rpx;font-size: 46rpx;font-weight: bold;margin-left: 50rpx;">验证码登录</view>
		<view class="cflex-c" style="justify-content: center;align-items: center;">
			<view class="cflex-r" style="border-bottom: 1rpx solid rgb(235,235,235);width: 600rpx;margin-top: 160rpx;
			align-items: center;font-weight: bold;">
				<view style="display: inline-block;width:160rpx;">手机号</view>
				<input v-model="phone" type="number" placeholder="输入11位手机号" style="font-weight: bold;width: 300rpx;"
					maxlength="11" />
			</view>
			<view class="cflex-r"
				style="border-bottom: 1rpx solid rgb(235,235,235);width: 600rpx;margin-top: 70rpx;justify-content: space-between;">
				<view class="cflex-r" style="align-items: center;font-weight: bold;">
					<view style="display: inline-block;width:160rpx;">验证码</view>
					<input v-model="code" placeholder="输入验证码" type="number" style="width: 300rpx;" />
				</view>
				<view v-show="showText" style="color: rgb(251,133,0);font-weight: bold;" @tap="getCode">获取</view>
				<view v-show="!showText">{{second}} s</view>
			</view>
			<view class="cflex-c"
				style="width: 600rpx;justify-content: center;align-items: center;margin-top: 270rpx;background-color: #4578F7;padding: 25rpx 0;border-radius: 50rpx;font-weight: bold;color: #fff;"
				@tap="login">登录</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				phone: '',
				code: '',
				openId: '',
				showText: true,
				second: 60,
			}
		},
		onLoad() {
			if (!uni.getStorageSync('token')) {
				let code = decodeURIComponent((new RegExp('[?|&]' + 'code' + '=' + '([^&;]+?)(&|#|;|$)').exec(
					location
					.href) || [, ''])[1].replace(/\+/g, '%20')) || null
				this.creadH5(code)
			}
		},
		methods: {
			//获取code
			wxCode() {
				let that = this
				let token = uni.getStorageSync('token')
				var ua = window.navigator.userAgent.toLowerCase();
				if (ua.match(/micromessenger/i) == 'micromessenger') {
					//微信登录获取code
					//判断是否在微信浏览器中打开
					// 当前H5页面的url
					//获取链接上面的code
					if (!uni.getStorageSync('token')) {
						var local = encodeURIComponent('https://h5.baijixing.com.cn/#/pagesB/login/login');
						var appid = 'wx8c726aef4a4b511a';
						//通过微信官方接口获取code之后，会重新刷新设置的回调地址
						var wxUrl =
							'https://open.weixin.qq.com/connect/oauth2/authorize?appid=' +
							appid +
							'&redirect_uri=' +
							local +
							'&response_type=code' +
							'&scope=snsapi_userinfo' +
							'&state=STATE#wechat_redirect';
						window.location.href = wxUrl;
					}
				} else {
					return false;
				}
			},
			//微信H5 获取code
			async creadH5(code) {
				let res = await this.$request("wechat/silentLogin", {
					code: code
				}, 'get')
				if (res.msg == "登录失败") {
					this.wxCode()
				} else {
					this.openId = res.data.openId
				}

			},
			getCode() {
				if (this.phone.length != 11) {
					uni.showToast({
						title: '手机号不正确',
						icon: 'none',
					})
					return
				} else {
					this.showText = false;
					var interval = setInterval(() => {
						if (this.second > 0) {
							--this.second
						} else {
							this.showText = true
							return;
						}
					}, 1000)
					setTimeout(() => {
						clearInterval(interval)
						this.second = 60
						this.showText = true;
					}, 60000)
					this.$request("kehu/user/getLoginCode", {
						phone: this.phone
					}).then(res => {

					})

				}
				},
				login() {
					if (this.openId == '' || this.openId == null || !this.openId) {
						uni.showToast({
							title: '未授权',
							icon: 'none'
						})
						return false
					}
					if (this.phone.length != 11) {
						uni.showToast({
							title: '手机号不正确',
							icon: 'none',
						})
						return false
					}
					if (this.code == '') {
						uni.showToast({
							title: '验证码不能为空',
							icon: 'none',
						})
						return false
					}
					this.$request("wechat/login", {
						phone: this.phone,
						code: this.code,
						openId: this.openId,
						inviter: uni.getStorageSync('phone')
					}).then(res => {
						if(res.code!=500){
							this.$store.commit('setToken', res.msg);
							uni.reLaunch({
								url: '../../pages/tab1'
							})
						}else{
							uni.showToast({
								title:res.msg,
								icon:'none'
							})
							uni.removeStorageSync('phone')
						}
					})
				}
			}
		}
</script>

<style>
	page {
		background-color: white;
		;
	}
</style>